<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap Resume Page Template</title>
    <!-- Bootstrap -->
    <link href="css/bootstrap-4.4.1.css" rel="stylesheet">
  </head>
  <body>
    <div class="container">
      <hr>
      <div class="row">
        <div class="col-6">
          <h1>李彦斌</h1>
        </div>
        <div class="col-6">
          <p class="text-right"><a href="">Download my Resume</a></p>
        </div>
      </div>
      <hr>
      <div class="row">
        <div class="col-md-8 col-sm-12">
          <div class="media">
            <img class="mr-3" src="images/touxiang.jpg" alt="Generic placeholder image">
            <div class="media-body">
              <h5 class="mt-0">前端开发</h5>
              啥也不会，就混口饭吃
            </div>
          </div>
        </div>
        <div class="col-md-4 col-sm-12">
          <div class="row justify-content-md-around m-1">
            <address>
              <strong>李彦斌&nbsp;</strong><br>
              朔城区<br>
              山西朔州<br>
              <abbr title="Phone">P:</abbr> (+86) 400-888-8888<br>
              <a href="mailto:#">pianrende@gmail.com</a>
            </address>
          </div>
        </div>
      </div>
      <hr>
      <div class="row">
        <div class="col-md-6 col-sm-12">
          <h2>教育经历</h2>
          <hr>
          <div class="row">
            <div class="col-6">
              <h4>朔城区一中</h4>
            </div>
            <div class="col-6">
              <h5 class="text-right"><span aria-hidden="true"></span> 2020.9.1-2023.6.1</h5>
            </div>
          </div>
          <h5><span class="badge badge-secondary">高中学历</span></h5>
          <p>高中混了三年</p>
          <div class="row">
            <div class="col-6">
              <h4>朔城区元博中学</h4>
            </div>
            <div class="col-6">
              <h5 class="text-right"><span aria-hidden="true"></span> 2017.9.1-2020.6.1</h5>
            </div>
          </div>
          <h5><span class="badge badge-secondary">初中学历&nbsp;</span></h5>
          <p>初中也是混了三年</p>
        </div>
        <div class="col-md-6 col-sm-12">
          <h2>技能</h2>
          <hr>
          <div class="progress mt-4">
            <div class="progress-bar bg-success" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 85%"> HTML</div>
          </div>
          <div class="progress mt-4">
            <div class="progress-bar bg-success" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%"> CSS</div>
          </div>
          <div class="progress mt-4">
            <div class="progress-bar bg-success" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width: 70%"> JAVASCRIPT</div>
          </div>
          <div class="progress mt-4">
            <div class="progress-bar bg-info" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%"> Python</div>
          </div>
          <div class="progress mt-4">
            <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="55" aria-valuemin="0" aria-valuemax="100" style="width: 55%"> C++</div>
          </div>
          <div class="progress mt-4">
            <div class="progress-bar bg-danger" role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width: 50%"> Arduino</div>
          </div>
          <div class="progress mt-4">
            <div class="progress-bar bg-danger" role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width: 50%"> kali Linux</div>
          </div>
        </div>
      </div>
      
      
      <hr>
      
      

      
      <hr>
      <footer class="text-center">
        <div class="container">
          <div class="row">
            <div class="col-12">
              <p>Copyright © MyWebsite. All rights reserved.</p>
            </div>
          </div>
        </div>
      </footer>
    </div>
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="js/jquery-3.4.1.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/popper.min.js"></script>
    <script src="js/bootstrap-4.4.1.js"></script>
  </body>
</html>